<template>
    <view class="page-activity-detail">
        <view class="banner">
            <u-image width="100%" height="358rpx" :src="proxy.$icon.detailsbanner"></u-image>
        </view>
        <view class="info fly-card mb-2">
            <view class="content mx-4">
                <view class="title font-bold">{{ info.activitiesName }}</view>
                <view class="flex-between mt-2 mb-3">
                    <view class="tags">
                        <u-tag class="tag-noborder mr-1" :class="'activity-tag-' + info.activitiesType" :text="proxy.$util.setName(info.activitiesType, optionData.activitiesType)" />
                        <u-tag class="tag-red tag-noborder" text="签到" v-if="info.isCheckinRequired == '1'" />
                    </view>
                    <!-- <view class="grey9"><u-icon name="map"></u-icon>0.5km</view> -->
                </view>
                <view class="desc">
                    <view>时间：<text class="c-grey3">{{ info.startTime }} {{ proxy.$util.getWeekName(dayjs(info.startTime).day()) }}</text></view>
                    <view class="flex-between" @click="openMap">
                        <view class="mr-4">地址：<text class="c-grey3">{{ info.address }}</text></view>
                        <u-image :src="proxy.$icon.navigation" width="40rpx" height="40rpx"></u-image>
                    </view>
                </view>
            </view>
        </view>
        <view class="tab">
            <u-tabs :list="tab.list" :is-scroll="false" v-model="tab.current" active-color="#24BCB8"></u-tabs>
            <view class="tab-content">
                <view class="tab-1" v-show="tab.current == 0">
                    <view class="fly-title">内容简介</view>
                    <view>{{ info.description }}</view>
                    <view class="fly-title">推荐语&备注</view>
                    <view>{{ info.recommendations }}</view>                    
                </view>
                <view class="tab-2" v-show="tab.current == 1">
                    <view class="fly-title">1、自我介绍</view>
                    <view>轮流自我介绍，可以在活动小群内发出自己的发言序号，帮助大家互相认识。由主持人开始，主持人序号为1，采用顺时针顺序。</view>
                    <view class="fly-title">2、问题讨论</view>
                    <view>Q1 {{ info.discussionQuestions1 }}</view>
                    <view>Q2 {{ info.discussionQuestions2 }}</view>
                    <view>Q3 {{ info.discussionQuestions3 }}</view>
                    <view class="fly-title">3、最佳投选</view>
                    <view>根据前面的发言，在小程序【成员】页面投选最佳发言者，投给你认为的本场最佳发言者，大家投完后由主持人宣布票数第一名,</view>
                    <view class="fly-title">关于“申请成为主持人”</view>
                    <view class="font-bold">·每位参与者都可以成为主持人</view>
                    <view class="mt-2">报名本次活动的每位成员都可以成为主持人。主持人不需要额外准备，主要是现场引导大家进入流程、安排发言顺序、提示大家不要偏离话题。主持人也要参与全程的问题讨论</view>
                    <view class="font-bold mt-2">·成为主持人的益处</view>
                    <view class="mt-2">主持人在现场会受到更多的关注，更能被大家认识和了解，同时也可以锻炼表达和场控能力。主持人可以修改讨论问题，主导读书会。</view>
                    <view class="font-bold mt-2">·每场一位主持人</view>
                    <view class="mt-2">非常鼓励大家表达和展现自己。这是一个非常好的的场景去练习表达能力，欢迎大家踊跃成为主持人，点击右下角【成为主持人】按钮即可，主持人只有一位，先来先得。</view>
                </view>
                <view class="tab-3 text-center" v-show="tab.current == 2">
                    <u-image width="400rpx" height="400rpx" :src="apiUrl + info.groupQrcodeUrl" class="inline-block"></u-image>
                    <view class="mb-4">群二维码</view>
                    <u-image width="400rpx" height="400rpx" :src="apiUrl + info.organizerWechatQrcodeUrl" class="inline-block"></u-image>
                    <view>发起人二维码</view>
                </view>
            </view>
        </view>
        <view class="fly-bottom-bar">
            <view class="content flex-between">
                <view class="flex-1 mr-4"><u-button class="btn-red" @click="handleExamine(3)">拒绝通过</u-button></view>
                <view class="flex-1"><u-button class="btn-deepCyan" @click="handleExamine(2)">审核通过</u-button></view>
            </view>
        </view>
    </view>
</template>
<script setup lang="ts">
import {apiUrl} from '@/static/js/config';
import dayjs from 'dayjs';
import {onShow, onLoad, onShareAppMessage} from '@dcloudio/uni-app';
import { useAppStore } from '@/stores/app';
import { useOptionData } from '@/stores/optionData';
const {proxy} = getCurrentInstance() as ComponentInternalInstance;
const appStore = useAppStore();
const optionDataStore = useOptionData();
let pageParams = reactive({});
let info = ref();
let tab = reactive({
    list:[
        {name: '活动详情'},
        {name: '活动流程'},
        {name: '群二维码'},
    ],
    current: 0,
});
let optionData = reactive({});
const getInitData = async () => {
  let activitiesType = await optionDataStore.getDictList('activitie_type');
  optionData.activitiesType = activitiesType;
}
const getDetail = () => {
    proxy.$http('get', '/admin/activities/'+ pageParams.id, {}, (data,msg) => {
        info.value = data;
    });
};
const openMap = () => {
    uni.getLocation({
        type: 'gcj02', //返回可以用于wx.openLocation的经纬度
        success (res) {
            const latitude = res.latitude
            const longitude = res.longitude
            uni.openLocation({
                latitude,
                longitude,
                scale: 18
            });   
        },
        fail: error => {
            console.log(error)
        }
    })
};
const handleExamine = (status) => {
    proxy.$http('put', '/admin/activities/'+pageParams.id+'/status?status=' + status, {}, (data,msg) => {
        uni.showModal({
            title: '提示',
            content: status == 2 ? '审核通过' : '已拒绝',
            showCancel: false,
            success: res => {
                if(res.confirm){
                    uni.navigateBack(-1);
                }
            }
        });
    })
}
onLoad((e) => {
    pageParams = e;
});
onShow(() => {
    getInitData();
    getDetail();
})

</script>